<template>
	<view class="container">
		<!-- #ifdef MP-WEIXIN -->
		<view class="status_bar" :style="'height:'+tophight.top+'px;'"></view>
		<view class="status_title" :style="'height:'+tophight.height+'px;'">
			医院同款
		</view>
		<!-- #endif -->
		<view class="scheme">AI检测-出调理方案</view>
		<view class="list">
			<view class="item">
				<image class="image" src="https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/948d6657-2d06-4235-8ec6-47434a13eb19.png" mode=""></image>
				<view>结果响应及时</view>
			</view>
			<view class="item">
				<image class="image" src="https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/948d6657-2d06-4235-8ec6-47434a13eb19.png" mode=""></image>
				<view>个性化调理方案</view>
			</view>
			<view class="item">
				<image class="image" src="https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/948d6657-2d06-4235-8ec6-47434a13eb19.png" mode=""></image>
				<view>无缝集成</view>
			</view>
		</view>
		<view class="paging">
			<view class="paging-item" @click="toBTest">
				<view class="item-left">
					<image class="image" src="@/static/ai/ai-body.png" mode=""></image>
					<view class="dec">
						<view class="dec-t">
							<view class="label">体质检测</view>
							<view class="identifying">免费</view>
						</view>
						<view class="dec-b">
							<view class="text">查自己体质</view>
							<view class="tip">建议：3-6个月</view>
						</view>
					</view>
				</view>
				<view class="item-right">
					<image class="arrow-right" src="https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/fd497a4b-ff6f-4345-8251-3fc0868a651f.png"></image>
				</view>
			</view>
			<view class="paging-item" @click="toCamera">
				<view class="item-left">
					<image class="image" src="@/static/ai/ai-tongue.png" mode=""></image>
					<view class="dec">
						<view class="dec-t">
							<view class="label">舌诊</view>
							<view class="identifying">免费2次</view>
						</view>
						<view class="dec-b">
							<view class="text">看舌象知身体状况</view>
							<view class="tip">建议：每周1/次</view>
						</view>
					</view>
				</view>
				<view class="item-right">
					<image class="arrow-right" src="https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/fd497a4b-ff6f-4345-8251-3fc0868a651f.png"></image>
				</view>
			</view>
			<!-- <view class="paging-item">
				<view class="item-left">
					<image class="image" src="@/static/ai/ai-brain.png" mode=""></image>
					<view class="dec">
						<view class="label">经络检测</view>
						<view class="text">购买智能硬件 检测身体经络</view>
					</view>
				</view>
				<view class="item-right">
					<image class="arrow-right" src="https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/fd497a4b-ff6f-4345-8251-3fc0868a651f.png"></image>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				tophight:{}
			}
		},
		created() {
			// #ifdef MP-WEIXIN
			this.tophight = uni.getMenuButtonBoundingClientRect()
			// #endif
		},
		methods: {
			//拍照
			toCamera(){
				uni.navigateTo({
					url:'../../packagesAiPhoto/aiPhoto/aiPhoto'
				})
			},
			toBTest(){
				uni.navigateTo({
					url:'../../packagesAiPhoto/aiPhoto/bTest'
				})
			}
			
		},
	}
</script>

<style lang="scss" scoped>
	.container{
		background-image: url('https://jht-public.oss-cn-shenzhen.aliyuncs.com/2024/8/7ea9b3bd-9c97-44a8-91f4-9dca1bb92866.png');
		background-size: cover;
		// background-position: center;
		background-repeat: no-repeat;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: -1;
		width: 100%;
		height: 100%;
		.status_title{
			display: flex;
			justify-content: center;
			align-items: center;
			color: #000;
			font-size: 36rpx;
			font-weight: bold;
		}
		.scheme{
			text-align: center;
			color: #22262A;
			font-size: 48rpx;
			font-weight: 400;
			margin: 36rpx 0 26rpx;
		}
		.list{
			display: flex;
			justify-content: center;
			align-items: center;
			margin-bottom: 70rpx;
			.item{
				display: flex;
				align-items: center;
				font-size: 24rpx;
				font-weight: 400;
				color: #22262A;
				margin-right: 40rpx;
				.image{
					width: 40rpx;
					height: 40rpx;
					margin-right: 6rpx;
				}
				&:last-child{
					margin-right: 0;
				}
			}
		}
		.paging{
			margin: 0 30rpx;
			&-item{
				width: 100%;
				height: 168rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				border-radius: 12rpx;
				padding: 0 30rpx;
				background: #fff;
				margin-bottom: 32rpx;
				box-sizing: border-box;
				.item-left{
					display: flex;
					align-items: center;
					flex: 1;
					.image{
						width: 110rpx;
						height: 110rpx;
						margin-right: 20rpx;
					}
					.dec{
						display: flex;
						flex-direction: column;
						flex: 1;
						.dec-t{
							display: flex;
							align-items: center;
							margin-bottom: 12rpx;
							.label{
								color: #140F08;
								font-size: 36rpx;
								font-weight: 700;
							}
							.identifying{
								font-size: 20rpx;
								font-weight: 400;
								color: #fff;
								background: #009FA9;
								padding: 6rpx;
								border-radius: 4rpx;
								margin-left: 16rpx;
							}
						}
						.dec-b{
							display: flex;
							justify-content: space-between;
							align-items: center;
							margin-right: 40rpx;
							font-weight: 400;
							.text{
								color: #140F08B3;
								font-size: 28rpx;
							}
							.tip{
								font-size: 24rpx;
								color: #140F0880;
							}
						}
					}
				}
				.item-right{
					.arrow-right{
						width: 48rpx;
						height: 48rpx;
					}
				}
			}
		}
	}
</style>